! function (width, document, $, undefined) {
    $.fn.slider = function () {
        this.each(function () {
            var $scroll = $(this);
            var $target = $scroll.find('.pre_page,.next_page');
            var width = $scroll.find('.roasting_item').width();
            var timer;

            $target.on('click', function () {
                var $this = $(this);
                if ($this.hasClass('next_page')) {
                    $scroll.find('.scroll_wp').stop().animate({ 'margin-left': -width }, function () {
                        $scroll.find('.scroll_wp').append($scroll.find('.scroll_wp .roasting_item').first());
                        $scroll.find('.scroll_wp').css({ 'margin-left': 0 });
                    });
                } else {
                    $scroll.find('.scroll_wp').prepend($scroll.find('.scroll_wp .roasting_item').last());
                    $scroll.find('.scroll_wp').css({ 'margin-left': -width });
                    $scroll.find('.scroll_wp').stop().animate({ 'margin-left': 0 }, 500, function () {});
                }

            });

            $scroll.on('mouseover', function () {
                clearInterval(timer);
            });
            $scroll.on('mouseout', function () {
                timer = setInterval(function () {
                    $scroll.find('.next_page').trigger('click');
                }, 5000);
            });
            timer = setInterval(function () {
                $scroll.find('.next_page').trigger('click');
            }, 5000);
        })
    };
    $('.roasting').slider();
}(window, document, jQuery);